<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
    <link th:href="@{/css/login.css}" rel="stylesheet" type="text/css" />
    <!--    //表单验证-->
    <script src="js/CheckForm.js" type="text/javascript"></script>
    <!--    //通用方法-->
    <script src="js/common.js" type="text/javascript"></script>
    <!--    //jquery-->
    <script src="js/jquery-3.6.0.min.js" type="text/javascript"></script>
    <!--    //layer-->
    <script src="js/layer/layer.js" type="text/javascript"></script>
    <!--    //MD5-->
    <script src="https://cdn.bootcdn.net/ajax/libs/blueimp-md5/2.18.0/js/md5.js"></script>
</head>
<body>
<div class="main">
    <div class="loginBar">
        <img src="imgs/logo.jpg" width="200" height="200">
        <form action="/do_login" onsubmit="return false" method="post" >
            <input class="login_text" id="username" name="username"  type="text" placeholder="用户名" required>
            <input class="login_text" id="password" name="password"  type="password" placeholder="密码" required>
            <div><input type="button" class="login_but" onclick="doLogin()" value="登录">
                <input type="reset" class="login_but" value="重置"></div>
        </form>
    </div>
</div>

<script>
    // ajax登录
    function doLogin(){
        // 加载框启动
        let loading = layer.load();
        //对明文密码+固定salt进行md5加密
        let pass = $("#password").val();
        let salt = window.loginSalt;
        let str  = "" + salt.charAt(0) + salt.charAt(1) + pass + salt.charAt(2);
        let password = md5(str);
        layer.closeAll();
        $.ajax({
            url:"/do_login",
            type:"post",
            data:{
                username:$("#username").val(),
                password:password
            },
            success:function (data){
                layer.closeAll();
                console.log(data);
                if (data.code===0){
                    layer.msg("成功");
                    window.location.href="/goods/to_list";
                }else {
                    alert(data.msg);
                }
            },
            error:function (data){
                layer.closeAll();
                console.log(data);
            }

        })
    }
</script>
</body>
</html>